home *** CD-ROM | disk | FTP | other *** search
/ PC World Komputer 2010 April / PCWorld0410.iso / pluginy Firefox / 60 / 60.xpi / chrome / webdeveloper.jar / content / webdeveloper / css.js < prev    next >
Text File  |  2009-06-30  |  31KB  |  702 lines
  1. var webdeveloper_userStyleSheet = null;
  2.  
  3. // Adds a user style sheet to the page
  4. function webdeveloper_addUserStyleSheet(element)
  5. {
  6.     var addStyleSheet = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  7.  
  8.     // If adding a style sheet
  9.     if(addStyleSheet)
  10.     {
  11.         var filePicker   = Components.classes["@mozilla.org/filepicker;1"].createInstance(Components.interfaces.nsIFilePicker);
  12.         var stringBundle = document.getElementById("webdeveloper-string-bundle");
  13.  
  14.         filePicker.appendFilter(stringBundle.getString("webdeveloper_styleSheetDescription"), "*.css");
  15.         filePicker.init(window, stringBundle.getString("webdeveloper_addUserStyleSheet"), filePicker.modeOpen);
  16.  
  17.         // If the user selected a style sheet
  18.         if(filePicker.show() == filePicker.returnOK)
  19.         {
  20.             var inputStream      = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
  21.             var scriptableStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
  22.  
  23.             inputStream.init(filePicker.file, 0x01, 0444, null);
  24.             scriptableStream.init(inputStream);
  25.  
  26.             webdeveloper_userStyleSheet = scriptableStream.read(scriptableStream.available());
  27.  
  28.             scriptableStream.close();
  29.             inputStream.close();
  30.         }
  31.         else
  32.         {
  33.             addStyleSheet               = false;
  34.             webdeveloper_userStyleSheet = null;
  35.         }
  36.     }
  37.  
  38.     // If adding a style sheet and the style sheet is not empty
  39.     if(addStyleSheet && webdeveloper_userStyleSheet)
  40.     {
  41.         var documentList   = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  42.         var documentLength = documentList.length;
  43.         var pageDocument   = null;
  44.         var styleElement   = null;
  45.  
  46.         // Loop through the documents
  47.         for(var i = 0; i < documentLength; i++)
  48.         {
  49.             pageDocument = documentList[i];
  50.             styleElement = pageDocument.createElement("style");
  51.  
  52.             styleElement.setAttribute("id", "webdeveloper-add-user-style-sheet");
  53.             styleElement.setAttribute("type", "text/css");
  54.             styleElement.appendChild(pageDocument.createTextNode(webdeveloper_userStyleSheet));
  55.  
  56.             webdeveloper_getDocumentHeadElement(pageDocument).appendChild(styleElement);
  57.         }
  58.  
  59.         webdeveloper_addAppliedStyle("webdeveloper-add-user-style-sheet");
  60.     }
  61.     else
  62.     {
  63.         webdeveloper_userStyleSheet = null;
  64.         webdeveloper_removeStyleSheet("webdeveloper-add-user-style-sheet", true);
  65.     }
  66. }
  67.  
  68. // Display CSS for the given media type
  69. function webdeveloper_displayCSSMediaType(type, reset)
  70. {
  71.     var documentList     = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  72.     var documentLength   = documentList.length;
  73.     var media            = null;
  74.     var pageDocument     = null;
  75.     var styleSheet       = null;
  76.     var styleSheetLength = null;
  77.     var styleSheetList   = null;
  78.  
  79.     // Loop through the documents
  80.     for(var i = 0; i < documentLength; i++)
  81.     {
  82.         pageDocument     = documentList[i];
  83.         styleSheetList   = pageDocument.styleSheets;
  84.         styleSheetLength = styleSheetList.length;
  85.  
  86.         // Loop through the style sheets
  87.         for(var j = 0; j < styleSheetLength; j++)
  88.         {
  89.             styleSheet = styleSheetList[j];
  90.  
  91.             // If the style sheet is valid and not an alternate style sheet
  92.             if(webdeveloper_isValidStyleSheet(styleSheet) && !webdeveloper_isAlternateStyleSheet(styleSheet))
  93.             {
  94.                 media = styleSheet.media;
  95.  
  96.                 // If resetting
  97.                 if(reset)
  98.                 {
  99.                     // If the style sheet has the webdeveloper-appended-screen media
  100.                     if(webdeveloper_isMediaStyleSheet(styleSheet, "webdeveloper-appended-screen"))
  101.                     {
  102.                         media.deleteMedium("webdeveloper-appended-screen");
  103.                         media.deleteMedium("screen");
  104.                     }
  105.                     else if(webdeveloper_isMediaStyleSheet(styleSheet, "webdeveloper-deleted-screen"))
  106.                     {
  107.                         media.appendMedium("screen");
  108.                         media.deleteMedium("webdeveloper-deleted-screen");
  109.                     }
  110.                 }
  111.                 else
  112.                 {
  113.                     // If the style sheet matches this media
  114.                     if(webdeveloper_isMediaStyleSheet(styleSheet, type))
  115.                     {
  116.                         // If the style sheet has the screen media
  117.                         if(!webdeveloper_isMediaStyleSheet(styleSheet, "screen"))
  118.                         {
  119.                             media.appendMedium("webdeveloper-appended-screen");
  120.                             media.appendMedium("screen");
  121.                         }
  122.                     }
  123.                     else if(webdeveloper_isMediaStyleSheet(styleSheet, "screen"))
  124.                     {
  125.                         // If the media length is not 0
  126.                         if(media.length != 0)
  127.                         {
  128.                             media.deleteMedium("screen");
  129.                         }
  130.  
  131.                         media.appendMedium("webdeveloper-deleted-screen");
  132.                     }
  133.                 }
  134.  
  135.                 // Force the styles to reapply by disabling and enabling the style sheet
  136.                 styleSheet.disabled = true;
  137.                 styleSheet.disabled = false;
  138.             }
  139.         }
  140.     }
  141. }
  142.  
  143. // Display the disable individual style sheet menu
  144. function webdeveloper_displayDisableIndividualStyleSheetMenu(menu)
  145. {
  146.     var currentDocument  = webdeveloper_getContentDocument();
  147.     var mediaList        = null;
  148.     var menuItem         = null;
  149.     var ownerNode        = null;
  150.     var styleSheet       = null;
  151.     var styleSheetHref   = null;
  152.     var styleSheetLabel  = null;
  153.     var styleSheetList   = currentDocument.styleSheets;
  154.     var styleSheetLength = styleSheetList.length;
  155.  
  156.     webdeveloper_removeGeneratedMenuItems(menu);
  157.  
  158.     // Loop through the style sheets
  159.     for(var i = 0; i < styleSheetLength; i++)
  160.     {
  161.         styleSheet     = styleSheetList[i];
  162.         ownerNode      = styleSheet.ownerNode;
  163.         styleSheetHref = styleSheet.href;
  164.  
  165.         // If this is a valid style sheet, is not an line style sheet and is not an alternate style sheet
  166.         if(webdeveloper_isValidStyleSheet(styleSheet) && styleSheetHref != currentDocument.documentURI)
  167.         {
  168.             menuItem = document.createElement("menuitem");
  169.  
  170.             // If the owner node is set, is not a processing instruction and has a title attribute
  171.             if(ownerNode && ownerNode.nodeType != Components.interfaces.nsIDOMNode.PROCESSING_INSTRUCTION_NODE && ownerNode.hasAttribute("title"))
  172.             {
  173.                 styleSheetLabel = ownerNode.getAttribute("title");
  174.             }
  175.             else
  176.             {
  177.                 styleSheetLabel = styleSheetHref;
  178.             }
  179.  
  180.             menuItem.setAttribute("class", "webdeveloper-generated-menu");
  181.             menuItem.setAttribute("label", styleSheetLabel);
  182.             menuItem.setAttribute("oncommand", "webdeveloper_toggleIndividualStyleSheet('" + styleSheetHref + "')");
  183.             menuItem.setAttribute("type", "checkbox");
  184.  
  185.             // If the style sheet is disabled
  186.             if(!styleSheet.disabled)
  187.             {
  188.                 menuItem.setAttribute("checked", true);
  189.             }
  190.  
  191.             menu.appendChild(menuItem);
  192.         }
  193.     }
  194.  
  195.     // If the menu has no children
  196.     if(!menu.hasChildNodes())
  197.     {
  198.         menuItem        = document.createElement("menuitem");
  199.         styleSheetLabel = document.getElementById("webdeveloper-string-bundle").getString("webdeveloper_noStyleSheets");
  200.  
  201.         menuItem.disabled = true;
  202.         menuItem.setAttribute("class", "webdeveloper-generated-menu");
  203.         menuItem.setAttribute("label", styleSheetLabel);
  204.         menu.appendChild(menuItem);
  205.     }
  206. }
  207.  
  208. // Display CSS for the handheld media type
  209. function webdeveloper_displayHandheldCSS(element)
  210. {
  211.     var printElement = document.getElementById("webdeveloper-display-print-css-menu");
  212.  
  213.     webdeveloper_configureElementByAppliedStyle(printElement, "checked", "webdeveloper-display-print-css");
  214.  
  215.     // If the print element is checked
  216.     if(webdeveloper_convertToBoolean(printElement.getAttribute("checked")))
  217.     {
  218.         webdeveloper_displayCSSMediaType("print", true);
  219.         webdeveloper_removeStyleSheet("webdeveloper-display-print-css");
  220.     }
  221.  
  222.     webdeveloper_displayCSSMediaType("handheld", !webdeveloper_convertToBoolean(element.getAttribute("checked")));
  223.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-display-handheld-css");
  224. }
  225.  
  226. // Display CSS for the print media type
  227. function webdeveloper_displayPrintCSS(element)
  228. {
  229.     var handheldElement = document.getElementById("webdeveloper-display-handheld-css-menu");
  230.  
  231.     webdeveloper_configureElementByAppliedStyle(handheldElement, "checked", "webdeveloper-display-handheld-css");
  232.  
  233.     // If the handheld element is checked
  234.     if(webdeveloper_convertToBoolean(handheldElement.getAttribute("checked")))
  235.     {
  236.         webdeveloper_displayCSSMediaType("handheld", true);
  237.         webdeveloper_removeStyleSheet("webdeveloper-display-handheld-css");
  238.     }
  239.  
  240.     webdeveloper_displayCSSMediaType("print", !webdeveloper_convertToBoolean(element.getAttribute("checked")));
  241.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-display-print-css");
  242. }
  243.  
  244. // Allows the user to edit the CSS of the current page
  245. function webdeveloper_editCSS()
  246. {
  247.     var stringBundle = document.getElementById("webdeveloper-string-bundle");
  248.     var editCSS      = stringBundle.getString("webdeveloper_editCSS");
  249.  
  250.     // If edit CSS is open in the dashboard
  251.     if(webdeveloper_isOpenInDashboard(editCSS))
  252.     {
  253.         webdeveloper_closeInDashboard(editCSS);
  254.     }
  255.     else if(webdeveloper_pageHasFrames())
  256.     {
  257.         window.openDialog("chrome://webdeveloper/content/message/message.xul", "webdeveloper-message-dialog", "centerscreen,chrome,modal", stringBundle.getString("webdeveloper_framesNotSupported"));
  258.     }
  259.     else
  260.     {
  261.         webdeveloper_openInDashboard(editCSS, "chrome://webdeveloper/content/dashboard/edit_css.xul");
  262.     }
  263. }
  264.  
  265. // Toggles the border box model
  266. function webdeveloper_toggleBorderBoxModel(element)
  267. {
  268.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/use_border_box_model.css", "webdeveloper-use-border-box-model");
  269. }
  270.  
  271. // Toggles the browser default styles
  272. function webdeveloper_toggleBrowserDefaultStyles(element)
  273. {
  274.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/disable_browser_default_styles.css", "webdeveloper-disable-browser-default-styles");
  275. }
  276.  
  277. // Toggles all the inline styles in elements in the document
  278. function webdeveloper_toggleDocumentInlineStyles(node, disable)
  279. {
  280.     // If the node exists and is an element
  281.     if(node && node.nodeType == Node.ELEMENT_NODE)
  282.     {
  283.         var childNodes       = node.childNodes;
  284.         var childNodesLength = childNodes.length;
  285.  
  286.         // If disabling styles and the node has a style attribute
  287.         if(disable && node.hasAttribute("style"))
  288.         {
  289.             node.setAttribute("webdeveloper-inline-style", node.getAttribute("style"));
  290.             node.removeAttribute("style");
  291.         }
  292.         else if(!disable && node.hasAttribute("webdeveloper-inline-style"))
  293.         {
  294.             node.setAttribute("style", node.getAttribute("webdeveloper-inline-style"));
  295.             node.removeAttribute("webdeveloper-inline-style");
  296.         }
  297.  
  298.         // Loop through the child nodes
  299.         for(var i = 0; i < childNodesLength; i++)
  300.         {
  301.             webdeveloper_toggleDocumentInlineStyles(childNodes[i], disable);
  302.         }
  303.     }
  304. }
  305.  
  306. // Toggles all the embedded styles on the page
  307. function webdeveloper_toggleEmbeddedStyles(element)
  308. {
  309.     var disable          = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  310.     var documentList     = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  311.     var documentLength   = documentList.length;
  312.     var pageDocument     = null;
  313.     var styleSheetLength = null;
  314.     var styleSheetList   = null;
  315.     var styleSheet       = null;
  316.  
  317.     // Loop through the documents
  318.     for(var i = 0; i < documentLength; i++)
  319.     {
  320.         pageDocument     = documentList[i];
  321.         styleSheetList   = pageDocument.getElementsByTagName("style");
  322.         styleSheetLength = styleSheetList.length;
  323.  
  324.         // Loop through all the stylesheets
  325.         for(var j = 0; j < styleSheetLength; j++)
  326.         {
  327.             styleSheet = styleSheetList[j].sheet;
  328.  
  329.             // If this is a valid style sheet
  330.             if(webdeveloper_isValidStyleSheet(styleSheet))
  331.             {
  332.                 styleSheet.disabled = disable;
  333.             }
  334.         }
  335.  
  336.     }
  337.  
  338.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-disable-embedded-styles");
  339. }
  340.  
  341. // Toggles all the inline styles in elements on the page
  342. function webdeveloper_toggleInlineStyles(element)
  343. {
  344.     var disable        = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  345.     var documentList   = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  346.     var documentLength = documentList.length;
  347.  
  348.     // Loop through the documents
  349.     for(var i = 0; i < documentLength; i++)
  350.     {
  351.         webdeveloper_toggleDocumentInlineStyles(documentList[i].documentElement, disable);
  352.     }
  353.  
  354.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-disable-inline-styles");
  355. }
  356.  
  357. // Toggles all the linked styles on the page
  358. function webdeveloper_toggleLinkedStyles(element)
  359. {
  360.     var disable          = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  361.     var documentList     = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  362.     var documentLength   = documentList.length;
  363.     var ownerNode        = null;
  364.     var pageDocument     = null;
  365.     var styleSheet       = null;
  366.     var styleSheetLength = null;
  367.     var styleSheetList   = null;
  368.  
  369.     // Loop through the documents
  370.     for(var i = 0; i < documentLength; i++)
  371.     {
  372.         pageDocument     = documentList[i];
  373.         styleSheetList   = pageDocument.styleSheets;
  374.         styleSheetLength = styleSheetList.length;
  375.  
  376.         // Loop through all the stylesheets
  377.         for(var j = 0; j < styleSheetLength; j++)
  378.         {
  379.             styleSheet = styleSheetList[j];
  380.  
  381.             // If this is a valid style sheet, is not an inline style sheet and is not an alternate style sheet or style sheets are being disabled
  382.             if(webdeveloper_isValidStyleSheet(styleSheet) && styleSheet.href != pageDocument.documentURI && (!webdeveloper_isAlternateStyleSheet(styleSheet) || disable))
  383.             {
  384.                 styleSheet.disabled = disable;
  385.             }
  386.         }
  387.     }
  388.  
  389.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-disable-linked-styles");
  390. }
  391.  
  392. // Toggles the print styles for the page
  393. function webdeveloper_togglePrintStyles(element)
  394. {
  395.     var disable         = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  396.     var documentList    = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  397.     var documentLength  = documentList.length;
  398.     var pageDocument    = null;
  399.     var styleSheet      = null;
  400.     var styleSheetLength = null;
  401.     var styleSheetList  = null;
  402.  
  403.     // Loop through the documents
  404.     for(var i = 0; i < documentLength; i++)
  405.     {
  406.         pageDocument     = documentList[i];
  407.         styleSheetList   = pageDocument.styleSheets;
  408.         styleSheetLength = styleSheetList.length;
  409.  
  410.         // Loop through the style sheets
  411.         for(var j = 0; j < styleSheetLength; j++)
  412.         {
  413.             styleSheet = styleSheetList[j];
  414.  
  415.             // If the style sheet is valid, is not an alternate style sheet and is a print style sheet, but not a screen style sheet
  416.             if(webdeveloper_isValidStyleSheet(styleSheet) && !webdeveloper_isAlternateStyleSheet(styleSheet) && webdeveloper_isMediaStyleSheet(styleSheet, "print") && !webdeveloper_isMediaStyleSheet(styleSheet, "screen"))
  417.             {
  418.                 styleSheet.disabled = disable;
  419.             }
  420.         }
  421.     }
  422.  
  423.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-disable-print-styles");
  424. }
  425.  
  426. // Toggles the styles for the page
  427. function webdeveloper_toggleStyles(element)
  428. {
  429.     var disable          = true;
  430.     var contentWindow    = webdeveloper_getContentWindow();
  431.     var documentList     = webdeveloper_getDocuments(contentWindow);
  432.     var documentLength   = documentList.length;
  433.     var key              = null;
  434.     var ownerNode        = null;
  435.     var pageDocument     = null;
  436.     var styleElement     = null;
  437.     var styleSheet       = null;
  438.     var styleSheetLength = null;
  439.     var styleSheetList   = null;
  440.  
  441.     // If the element is set
  442.     if(element)
  443.     {
  444.         disable = webdeveloper_convertToBoolean(element.getAttribute("checked"));
  445.     }
  446.     else
  447.     {
  448.         var currentDocument = contentWindow.document;
  449.  
  450.         element = document.getElementById("webdeveloper-disable-all-styles-menu");
  451.  
  452.         // If the disable all styles element is set
  453.         if(currentDocument.getElementById("webdeveloper-disable-all-styles"))
  454.         {
  455.             disable = false;
  456.         }
  457.  
  458.         webdeveloper_configureElement(element, "checked", disable);
  459.     }
  460.  
  461.     // Loop through the documents
  462.     for(var i = 0; i < documentLength; i++)
  463.     {
  464.         pageDocument     = documentList[i];
  465.         styleSheetList   = pageDocument.styleSheets;
  466.         styleSheetLength = styleSheetList.length;
  467.  
  468.         // Loop through all the stylesheets
  469.         for(var j = 0; j < styleSheetLength; j++)
  470.         {
  471.             styleSheet = styleSheetList[j];
  472.  
  473.             // If this is a valid style sheet and is not an alternate style sheet
  474.             if(webdeveloper_isValidStyleSheet(styleSheet) && (!webdeveloper_isAlternateStyleSheet(styleSheet) || disable))
  475.             {
  476.                 styleSheet.disabled = disable;
  477.             }
  478.         }
  479.  
  480.         webdeveloper_toggleDocumentInlineStyles(pageDocument.documentElement, disable);
  481.     }
  482.  
  483.     // Toggle other CSS feature keyboard shortcuts
  484.     document.getElementById("webdeveloper-edit-css-key").setAttribute("disabled", disable);
  485.     document.getElementById("webdeveloper-view-style-information-key").setAttribute("disabled", disable);
  486.  
  487.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-disable-all-styles");
  488. }
  489.  
  490. // Updates the CSS menu
  491. function webdeveloper_updateCSSMenu(suffix)
  492. {
  493.     var currentDocument         = webdeveloper_getContentDocument();
  494.     var disableAllStylesChecked = webdeveloper_contains(webdeveloper_appliedStyles, "webdeveloper-disable-all-styles");
  495.     var menu                    = document.getElementById("webdeveloper-edit-css-" + suffix);
  496.  
  497.     // If the menu exists
  498.     if(menu)
  499.     {
  500.         var editCSSOpen = webdeveloper_isOpenInDashboard(document.getElementById("webdeveloper-string-bundle").getString("webdeveloper_editCSS"));
  501.  
  502.         webdeveloper_configureElement(menu, "checked", editCSSOpen);
  503.  
  504.         // If edit CSS is not open and the page has frames
  505.         if(!editCSSOpen && webdeveloper_pageHasFrames())
  506.         {
  507.             menu.setAttribute("class", "menuitem-iconic");
  508.         }
  509.         else if(menu.hasAttribute("class"))
  510.         {
  511.             menu.removeAttribute("class");
  512.         }
  513.  
  514.         webdeveloper_configureElement(menu, "disabled", disableAllStylesChecked);
  515.     }
  516.  
  517.     menu = document.getElementById("webdeveloper-view-style-information-" + suffix);
  518.  
  519.     // If the menu exists
  520.     if(menu)
  521.     {
  522.         // If the DOM Inspector is not found
  523.         if(!webdeveloper_isDOMInspectorAvailable())
  524.         {
  525.             menu.setAttribute("class", "menuitem-iconic");
  526.         }
  527.         else if(menu.hasAttribute("class"))
  528.         {
  529.             menu.removeAttribute("class");
  530.         }
  531.  
  532.         webdeveloper_configureElement(menu, "disabled", disableAllStylesChecked);
  533.         webdeveloper_configureElementByAppliedStyle(menu, "checked", "webdeveloper-view-style-information");
  534.     }
  535.  
  536.     webdeveloper_configureElement(document.getElementById("webdeveloper-add-user-style-sheet-" + suffix), "disabled", disableAllStylesChecked);
  537.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-individual-style-sheet-" + suffix), "disabled", disableAllStylesChecked);
  538.     webdeveloper_configureElement(document.getElementById("webdeveloper-display-media-type-" + suffix), "disabled", disableAllStylesChecked);
  539.     webdeveloper_configureElement(document.getElementById("webdeveloper-use-border-box-model-" + suffix), "disabled", disableAllStylesChecked);
  540.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-add-user-style-sheet-" + suffix), "checked", "webdeveloper-add-user-style-sheet");
  541.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-use-border-box-model-" + suffix), "checked", "webdeveloper-use-border-box-model");
  542. }
  543.  
  544. // Updates the CSS media type menu
  545. function webdeveloper_updateCSSMediaTypeMenu(suffix)
  546. {
  547.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-handheld-css-" + suffix), "checked", "webdeveloper-display-handheld-css");
  548.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-print-css-" + suffix), "checked", "webdeveloper-display-print-css");
  549. }
  550.  
  551. // Updates the disable styles menu
  552. function webdeveloper_updateDisableStylesMenu(suffix)
  553. {
  554.     var currentDocument         = webdeveloper_getContentDocument();
  555.     var disableAllStylesChecked = webdeveloper_contains(webdeveloper_appliedStyles, "webdeveloper-disable-all-styles");
  556.  
  557.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-all-styles-" + suffix), "checked", disableAllStylesChecked);
  558.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-browser-default-styles-" + suffix), "disabled", disableAllStylesChecked);
  559.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-embedded-styles-" + suffix), "disabled", disableAllStylesChecked);
  560.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-inline-styles-" + suffix), "disabled", disableAllStylesChecked);
  561.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-linked-styles-" + suffix), "disabled", disableAllStylesChecked);
  562.     webdeveloper_configureElement(document.getElementById("webdeveloper-disable-print-styles-" + suffix), "disabled", disableAllStylesChecked);
  563.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-disable-browser-default-styles-" + suffix), "checked", "webdeveloper-disable-browser-default-styles");
  564.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-disable-embedded-styles-" + suffix), "checked", "webdeveloper-disable-embedded-styles");
  565.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-disable-inline-styles-" + suffix), "checked", "webdeveloper-disable-inline-styles");
  566.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-disable-linked-styles-" + suffix), "checked", "webdeveloper-disable-linked-styles");
  567.     webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-disable-print-styles-" + suffix), "checked", "webdeveloper-disable-print-styles");
  568. }
  569.  
  570. // View CSS
  571. function webdeveloper_viewCSS()
  572. {
  573.     var divElement        = null;
  574.     var documentList      = webdeveloper_getDocuments(webdeveloper_getContentWindow());
  575.     var documentLength    = documentList.length;
  576.     var documentURL       = null;
  577.     var inlineStylesText  = "";
  578.     var linkElement       = null;
  579.     var oldTab            = getBrowser().selectedTab;
  580.     var oldURL            = getBrowser().currentURI.spec;
  581.     var generatedDocument = webdeveloper_generateDocument("");
  582.     var bodyElement       = webdeveloper_getDocumentBodyElement(generatedDocument);
  583.     var headElement       = webdeveloper_getDocumentHeadElement(generatedDocument);
  584.     var headerElement     = generatedDocument.createElement("h1");
  585.     var pageDocument      = null;
  586.     var preElement        = null;
  587.     var scriptElement     = generatedDocument.createElement("script");
  588.     var spanElement       = null;
  589.     var stringBundle      = document.getElementById("webdeveloper-string-bundle");
  590.     var styleSheet        = null;
  591.     var styleSheetHref    = null;
  592.     var styleSheetList    = new Array();
  593.     var styleSheetLength  = null;
  594.     var title             = stringBundle.getFormattedString("webdeveloper_viewCSSTitle", [oldURL]);
  595.  
  596.     generatedDocument.title = title;
  597.  
  598.     webdeveloper_addGeneratedStyles(generatedDocument);
  599.  
  600.     headerElement.appendChild(generatedDocument.createTextNode(title));
  601.     bodyElement.appendChild(headerElement);
  602.  
  603.     webdeveloper_addGeneratedTools(generatedDocument);
  604.  
  605.     // Loop through the documents
  606.     for(var i = 0; i < documentLength; i++)
  607.     {
  608.         headerElement    = generatedDocument.createElement("h2");
  609.         inlineStylesText = "";
  610.         linkElement      = generatedDocument.createElement("a");
  611.         pageDocument     = documentList[i];
  612.         documentURL      = pageDocument.documentURI;
  613.         styleSheetList   = pageDocument.getElementsByTagName("style");
  614.         styleSheetLength = styleSheetList.length;
  615.  
  616.         linkElement.setAttribute("href", documentURL);
  617.         linkElement.appendChild(generatedDocument.createTextNode(documentURL));
  618.         headerElement.appendChild(linkElement);
  619.         bodyElement.appendChild(headerElement);
  620.  
  621.         // Loop through the inline style sheets
  622.         for(var j = 0; j < styleSheetLength; j++)
  623.         {
  624.             styleSheet = styleSheetList[j];
  625.  
  626.             // If this is a valid style sheet
  627.             if(webdeveloper_isValidStyleSheet(styleSheet.sheet) && (!styleSheet.hasAttribute("id") || styleSheet.getAttribute("id").indexOf("webdeveloper-") != 0))
  628.             {
  629.                 inlineStylesText += styleSheet.innerHTML.trim() + "\n\n";
  630.             }
  631.         }
  632.  
  633.         // If there are inline styles
  634.         if(inlineStylesText != "")
  635.         {
  636.             divElement    = generatedDocument.createElement("div");
  637.             headerElement = generatedDocument.createElement("h3");
  638.             preElement    = generatedDocument.createElement("pre");
  639.             spanElement   = generatedDocument.createElement("span");
  640.  
  641.             spanElement.setAttribute("class", "expanded pivot");
  642.             headerElement.appendChild(spanElement);
  643.             headerElement.appendChild(generatedDocument.createTextNode(stringBundle.getFormattedString("webdeveloper_embeddedStylesFrom", [documentURL])));
  644.             bodyElement.appendChild(headerElement);
  645.  
  646.             preElement.appendChild(generatedDocument.createTextNode(inlineStylesText));
  647.             divElement.setAttribute("class", "output");
  648.             divElement.appendChild(preElement);
  649.             bodyElement.appendChild(divElement);
  650.         }
  651.  
  652.         styleSheetList   = webdeveloper_getStyleSheetsForDocument(pageDocument, true, true);
  653.         styleSheetLength = styleSheetList.length;
  654.  
  655.         // Loop through the style sheets
  656.         for(j = 0; j < styleSheetLength; j++)
  657.         {
  658.             styleSheet = styleSheetList[j];
  659.  
  660.             // If this is a valid style sheet and is not an inline style sheet
  661.             if(webdeveloper_isValidStyleSheet(styleSheet) && styleSheet.href && styleSheet.href != documentURL)
  662.             {
  663.                 divElement     = generatedDocument.createElement("div");
  664.                 headerElement  = generatedDocument.createElement("h3");
  665.                 linkElement    = generatedDocument.createElement("a");
  666.                 preElement     = generatedDocument.createElement("pre");
  667.                 spanElement    = generatedDocument.createElement("span");
  668.                 styleSheetHref = styleSheet.href;
  669.  
  670.                 spanElement.setAttribute("class", "expanded pivot");
  671.                 headerElement.appendChild(spanElement);
  672.                 linkElement.setAttribute("href", styleSheetHref);
  673.                 linkElement.appendChild(generatedDocument.createTextNode(styleSheetHref));
  674.                 headerElement.appendChild(linkElement);
  675.                 bodyElement.appendChild(headerElement);
  676.                 preElement.appendChild(generatedDocument.createTextNode(webdeveloper_retrieveSource(styleSheetHref).replace(new RegExp("\r", "gi"), "\n")));
  677.                 divElement.setAttribute("class", "output");
  678.                 divElement.appendChild(preElement);
  679.                 bodyElement.appendChild(divElement);
  680.             }
  681.         }
  682.     }
  683.  
  684.     scriptElement.setAttribute("defer", "defer");
  685.     scriptElement.setAttribute("src", "chrome://webdeveloper/content/common/xpath.js");
  686.     scriptElement.setAttribute("type", "text/javascript");
  687.     headElement.appendChild(scriptElement);
  688.  
  689.     scriptElement = generatedDocument.createElement("script");
  690.  
  691.     scriptElement.setAttribute("defer", "defer");
  692.     scriptElement.setAttribute("src", "chrome://webdeveloper/content/generated/output_pivot.js");
  693.     scriptElement.setAttribute("type", "text/javascript");
  694.     headElement.appendChild(scriptElement);
  695.  
  696.     // If the open tabs in background preference is set to true
  697.     if(webdeveloper_getBooleanPreference("webdeveloper.open.tabs.background", true))
  698.     {
  699.         getBrowser().selectedTab = oldTab;
  700.     }
  701. }
  702.